<template>
	<view class="wrap">
		<u-form :model="model" :rules="rules" ref="uForm" :errorType="errorType" label-width="150">
			<u-form-item label-position="left" label="申请人">
				<text>{{join(selNameList)}}</text>
				<view slot="right">
					<u-button v-if="typeName=='加班'" type="primary" size="mini" @click="selectPerson(0)">选择</u-button>
				</view>

			</u-form-item>
			<u-form-item label-position="left" label="审批人">
				<text>{{chargeObj.chargeName}}</text>
				<view slot="right">
					<u-button type="primary" size="mini" @click="selectPerson(1)">选择</u-button>
				</view>
			</u-form-item>
			<u-form-item label-position="left" label="类型">

				<u-radio-group v-model="model.addType" @change="changeType">
					<u-radio name="1">加班</u-radio>
					<u-radio name="0">调休</u-radio>
				</u-radio-group>
			</u-form-item>
			<!-- 日期选择器应该为区间的日期选择 -->
			<u-form-item label-position="left" :label="typeName+'日期'" prop="workTime">
				<u-input type="select" :select-open="pickerShow" v-model="model.workTime"
					:placeholder="'请选择'+typeName+'日期'" @click="pickerShow = true"></u-input>
				<!-- <u-picker mode="time" v-model="pickerShow" :params="params" @confirm="regionConfirm"></u-picker> -->

				<u-calendar max-date="2050-01-01" v-model="pickerShow" ref="calendar" @change="regionConfirm" mode="range">
				</u-calendar>
			</u-form-item>
			<!-- 时长需要保证最小单位是0.5，需要使用步进器 -->
			<!-- 步长，每次加或减的值，1.4.5起支持小数值，如需小数，请设置positive-integer为false -->
			<u-form-item label-position="left" :label="typeName+'时长'" prop="workDays">
				<u-input :border="true" :placeholder="'单次'+typeName+'时长'" v-model="model.workDays" type="number">
				</u-input>
				<!-- 				<u-number-box :positive-integer='false' v-model="model.workDays" disabled-input :min="0"
				:step="0.5"  ></u-number-box> -->
			</u-form-item>
			<u-form-item label-position="left" label="备注" prop="reason">
				<u-input type="textarea" :border="true" :placeholder="typeName+'原因'" v-model="model.reason" />
			</u-form-item>
		</u-form>

		<u-button  :loading="loading" @click="submit" size="default" type="primary" :ripple="true">提交</u-button>
	</view>
</template>

<script>
	export default {
		data() {
			let that = this;
			return {
				pickerShow: false,
				loading:false,
				model: {
					// empId:'',
					// empName:'',
					workDays: '',
					workTime: '',
					addType: '1',
					reason: ''
				},
				rules: {
					empName: [{
						required: true,
						message: '请输入姓名',
						trigger: ['change', 'blur'],
					}, ],

					addType: [{
						required: true,
						message: '请选择类型',
						trigger: ['change', 'blur'],
					}, ],
					workTime: [{
						required: true,
						message: '请选择日期',
						trigger: ['change', 'blur'],
					}, ],
					workDays: [{
							required: true,
							message: '请输入时长',
							trigger: ['change', 'blur'],
						},
						{
							validator: (rule, value, callback) => {
								// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
								//由于最小单位是0.5 所以通过校验value*2是否为整数 
								return this.$u.test.digits(value * 2)
							},
							message: '请正确输入时长（最小单位0.5天）',
							trigger: ['change', 'blur'],
						}
					],
					reason: [{
						required: true,
						message: '请输入原因',
						trigger: ['change', 'blur'],
					}],

				},
				border: false,
				errorType: ['message'],
				dataSource: [],
				selIdList: [],
				selNameList: [],
				chargeObj: {
					chargeId: '', //项目负责人ID
					chargeName: '请选择'
				},
				adminObj: { //超级管理员信息
					_id: '',
					username: ''
				}
			};
		},
		onLoad() {
			//接收 选择页面传过来的值
			uni.$on('selPersonResult', (idList, nameList, type) => {
				console.log(idList, nameList, type);
				//type 0:申请人，1:审批人
				if (type == 1) {
					this.chargeObj.chargeId = idList[0]
					this.chargeObj.chargeName = nameList[0]
				} else if (type == 0) {
					this.selIdList = idList
					this.selNameList = nameList
				}


			})
			//根据角色id查询用户列表
			this.request('common/user/getUserByRole', {
				role_id: 'admin'
			}).then(res => {
				if (res.code == 0) {
					console.log(res);
					this.chargeObj.chargeId = res.data[0]._id
					this.chargeObj.chargeName = res.data[0].username
					this.adminObj = res.data[0];
				}
			})
			//初始化，默认选择自己
			this.$set(this.selIdList, 0, uni.getStorageSync('uid'))
			this.$set(this.selNameList, 0, uni.getStorageSync('username'))

		},
		computed: {
			typeName() {
				return this.model.addType == 0 ? '调休' : '加班';
			},
			borderCurrent() {
				return this.border ? 0 : 1;
			},
			join() {
				return function(item) {
					return item.join(',')
				}
			}
		},

		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},

		methods: {
			changeType(e) {
				//调休 type为0 时，只能选自己
				if (e == 0) {
					this.selIdList = [uni.getStorageSync('uid')]
					this.selNameList = [uni.getStorageSync('username')]
				}

				uni.setNavigationBarTitle({
					title: this.typeName + '录入'
				});
			},
			selectPerson(type) {
				uni.navigateTo({
					url: '../overtime/selPerson?selIdList=' + JSON.stringify(this.selIdList) + '&type=' + type,
				})
			},
			submit() {
				let that = this
				
				this.$refs.uForm.validate(valid => {
					if (valid) {
						let params = []
						const {
							chargeId
						} = that.chargeObj
						const {
							_id
						} = that.adminObj
						// delete that.model.workTime
						that.selIdList.forEach((ele, index) => {
							params.push({
								isAudit:'Y',
								empId: ele,
								empName: that.selNameList[index],
								chargeId,
								adminId:_id,
								...that.model
							})
						})
							that.loading = true
						this.request('business/work/add', params).then(res => {
							if (res.code == 0) {
								uni.showModal({
									showCancel: false,
									content: '录入成功',
									success: function(res) {
										if (res.confirm) {
											var pages = getCurrentPages(); //获取当前的页面栈
											var currPage = pages[pages.length - 1]; //当前页面
											var prevPage = pages[pages.length - 2]; //上一页面
											console.log(prevPage);
											// #ifdef MP
												prevPage.$vm.getApplyList(0);
												prevPage.$vm.getApplyList(1);
											// #endif			
																	
											// #ifdef H5
												prevPage.getApplyList(0);
												prevPage.getApplyList(1);
											// #endif

											uni.switchTab({
												url: './index',
												fail(e) {
													console.log(e);
												}
											})
										}
									}
								})

							} else {
								uni.showModal({
									showCancel: false,
									content: res.msg
								})
							}
							that.loading = false
						})
					}
				});
			},
			regionConfirm(e) {
				console.log(e);
				this.model.workTimeStart = e.startDate 
				this.model.workTimeEnd = e.endDate 
				this.model.workTime = this.model.workTimeStart + '至'+this.model.workTimeEnd
			},

		}
	};
</script>

<style scoped lang="scss">
	.wrap {
		padding: 30rpx;
	}

	.alternative {
		color: $u-tips-color;
		display: flex;
		justify-content: space-between;
		margin-top: 30rpx;
		margin-bottom: 30rpx;
	}

	.agreement {
		display: flex;
		align-items: center;
		margin: 40rpx 0;

		.agreement-text {
			padding-left: 8rpx;
			color: $u-tips-color;
		}
	}
</style>
